<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>小米商城</title>
    <link rel="stylesheet" href="./css/index.css">
    <script src="./js/index.js"></script>
</head>
<body>
    <div id="app">
        <!---------------------------------------------头部-------------------------------------------------------------->
        <div class="header">
            <!--回顶部的勾子div-->
            <div id="J_topbarBannerWrapper"></div>
            <!--顶部导航条-->
            <div class="site-topbar">
                <!--内容盒子-->
                <div class="container clearfix">
                    <!--链接-->
                    <div class="topbar-nav">
                        <a href="">小米商城</a>
                        <span class="sep">|</span>
                        <a href="">MIUI</a>
                        <span class="sep">|</span>
                        <a href="">loT</a>
                        <span class="sep">|</span>
                        <a href="">云服务</a>
                        <span class="sep">|</span>
                        <a href="">天星数科</a>
                        <span class="sep">|</span>
                        <a href="">有品</a>
                        <span class="sep">|</span>
                        <a href="">小爱开放平台</a>
                        <span class="sep">|</span>
                        <a href="">企业团购</a>
                        <span class="sep">|</span>
                        <a href="">资质证照</a>
                        <span class="sep">|</span>
                        <a href="">协议规则</a>
                        <span class="sep">|</span>
                        <a href="">下载app</a>
                        <span class="sep">|</span>
                        <a href="">智能生活</a>
                        <span class="sep">|</span>
                        <a href="">Select Location</a>
                    </div>
                    <!--购物车-->
                    <div class="topbar-cart">
                        <!--购物车点击图标-->
                        <a href="" class="cart-mini">
                            <!--购物车空时显示的图标-->
                            <em class="iconfont icon-gouwuche"></em>
                            <!--购物车有商品时显示的图标-->
                            <em class="iconfont-cart-full hide"></em>
                            购物车
                            <!--购物车中的商品数量-->
                            <span class="cart-mini-num">(0)</span>
                        </a>
                        <!--购物车商品内容-->
                        <div class="cart-menu" style="display: none">
                            <div class="menu-content">
                                <!--加载过程中展示-->
                                <div class="loading"></div>
                                <!--加载完成，后端返回数据后加载商品内容-->
                                <ul id="J_miniCartList" class="cart-list hide"></ul>
                                <div id="J_miniCartListTotal" class="cart-total clearfix hide"></div>
                                <div class="msg msg-error hide"></div>
                                <div class="msg msg-empty">购物车中还没有商品，赶紧选购吧！</div>
                            </div>
                        </div>
                    </div>
                    <!--登录注册消息通知-->
                    <div class="topbar-info">
                        <a href="" class="link">登录</a>
                        <span class="sep">|</span>
                        <a href="" class="link">注册</a>
                        <span class="sep">|</span>
                        <span class="message">
                            <a href="">消息通知</a>
                        </span>
                    </div>
                </div>
                <!--全球网站切换-->
                <div id="J_globalSiteLinks" style="display: none"></div>
            </div>
            <!--导航栏（子元素包含纵向导航栏）-->
            <div class="site-header">
                <div class="container clearfix">
                    <div class="header-logo">
                        <a href="//www.mi.com/index.html" title="小米官网" class="logo ir">小米官网</a>
                    </div>
                    <div class="header-nav">
                        <ul class="nav-list clearfix">
                            <li class="nav-category">
                                <a href="">隐藏li,子元素为竖导航</a>
                                <div class="site-category">
                                    <ul id="J_categoryList"
                                        class="site-category-list clearfix site-category-list-custom">
                                        <li class="category-item">
                                            <a href="" class="title">手机<em class="iconfont icon-youjiantou"></em></a>
                                            <!--右侧hover商品栏-->
                                            <div class="children clearfix ">
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/phonesmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </li>
                                        <li class="category-item">
                                            <a href="" class="title">电视<em class="iconfont icon-youjiantou"></em></a>
                                            <!--右侧hover商品栏-->
                                            <div class="children clearfix ">
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/tvsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </li>
                                        <li class="category-item">
                                            <a href="" class="title">笔记本 平板<em class="iconfont icon-youjiantou"></em></a>
                                            <!--右侧hover商品栏-->
                                            <div class="children clearfix ">
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/pingbansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/pingbansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/pingbansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/pingbansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/pingbansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/pingbansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/pingbansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/pingbansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/pingbansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/pingbansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </li>
                                        <li class="category-item">
                                            <a href="" class="title">家电<em class="iconfont icon-youjiantou"></em></a>
                                            <!--右侧hover商品栏-->
                                            <div class="children clearfix ">
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/jiadiansmall.jpg" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/jiadiansmall.jpg" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/jiadiansmall.jpg" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/jiadiansmall.jpg" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </li>
                                        <li class="category-item">
                                            <a href="" class="title">出行 穿戴<em class="iconfont icon-youjiantou"></em></a>
                                            <!--右侧hover商品栏-->
                                            <div class="children clearfix ">
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/chuxingsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/chuxingsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/chuxingsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </li>
                                        <li class="category-item">
                                            <a href="" class="title">智能 路由器<em class="iconfont icon-youjiantou"></em></a>
                                            <!--右侧hover商品栏-->
                                            <div class="children clearfix ">
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/zhinengsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/zhinengsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/zhinengsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/zhinengsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/zhinengsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/zhinengsmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </li>
                                        <li class="category-item">
                                            <a href="" class="title">电源 配件<em class="iconfont icon-youjiantou"></em></a>
                                            <!--右侧hover商品栏-->
                                            <div class="children clearfix ">
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/dianyuansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/dianyuansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/dianyuansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/dianyuansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/dianyuansmall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </li>
                                        <li class="category-item">
                                            <a href="" class="title">健康 儿童<em class="iconfont icon-youjiantou"></em></a>
                                            <!--右侧hover商品栏-->
                                            <div class="children clearfix ">
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/jiankangsmall.jpg" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/jiankangsmall.jpg" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/jiankangsmall.jpg" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/jiankangsmall.jpg" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/jiankangsmall.jpg" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </li>
                                        <li class="category-item">
                                            <a href="" class="title">耳机 音箱<em class="iconfont icon-youjiantou"></em></a>
                                            <!--右侧hover商品栏-->
                                            <div class="children clearfix ">
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/erjismall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/erjismall.png" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </li>
                                        <li class="category-item">
                                            <a href="" class="title">生活 鞋包<em class="iconfont icon-youjiantou"></em></a>
                                            <!--右侧hover商品栏-->
                                            <div class="children clearfix ">
                                                <ul class="children-list">
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/shenghuosmall.jpg" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/shenghuosmall.jpg" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/shenghuosmall.jpg" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="" class="link clearfix">
                                                            <img src="./img/shenghuosmall.jpg" alt="">
                                                            <span class="text">Xiaomi MIX 4</span>
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                            </li>
                            <li class="nav-item">
                                <a href="" class="link">
                                    <span>小米手机</span>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="" class="link">
                                    <span>Redmi红米</span>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="" class="link">
                                    <span>电视</span>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="" class="link">
                                    <span>笔记本</span>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="" class="link">
                                    <span>平板</span>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="" class="link">
                                    <span>家电</span>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="" class="link">
                                    <span>路由器</span>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="" class="link">
                                    <span>智能硬件</span>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="" class="link">
                                    <span>服务</span>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="" class="link">
                                    <span>社区</span>
                                </a>
                            </li>
                        </ul>
                    </div>
                    <div class="header-search">
                        <form action="" method="get" class="search-form clearfix">
                            <input type="text" class="search-text">
                            <input type="submit" value="&#xe624;" class="search-btn iconfont icon-sousuo">
                        </form>
                    </div>
                </div>
                <!--下拉菜单-->
                <div class="header-nav-menu">
                <div class="container">
                    <ul class="children-list clearfix">
                        <li class="first">
                            <a href="">
                                <div class="figure figure-thumb">
                                    <img src="./img/phonesmall.png" alt="Xiaomi MIX 4" width="160" height="110">
                                </div>
                                <div class="title">Xiaomi MIX4</div>
                                <p class="price">4999元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <div class="figure figure-thumb">
                                    <img src="./img/phonesmall.png" alt="Xiaomi MIX 4" width="160" height="110">
                                </div>
                                <div class="title">Xiaomi MIX4</div>
                                <p class="price">4999元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <div class="figure figure-thumb">
                                    <img src="./img/phonesmall.png" alt="Xiaomi MIX 4" width="160" height="110">
                                </div>
                                <div class="title">Xiaomi MIX4</div>
                                <p class="price">4999元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <div class="figure figure-thumb">
                                    <img src="./img/phonesmall.png" alt="Xiaomi MIX 4" width="160" height="110">
                                </div>
                                <div class="title">Xiaomi MIX4</div>
                                <p class="price">4999元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <div class="figure figure-thumb">
                                    <img src="./img/phonesmall.png" alt="Xiaomi MIX 4" width="160" height="110">
                                </div>
                                <div class="title">Xiaomi MIX4</div>
                                <p class="price">4999元起</p>
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <div class="figure figure-thumb">
                                    <img src="./img/phonesmall.png" alt="Xiaomi MIX 4" width="160" height="110">
                                </div>
                                <div class="title">Xiaomi MIX4</div>
                                <p class="price">4999元起</p>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
                <div class="header-nav-menu">
                    <div class="container">
                        <ul class="children-list clearfix">
                            <li class="first">
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/hongmi.png"
                                             alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/hongmi.png"
                                             alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/hongmi.png"
                                             alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/hongmi.png"
                                             alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/hongmi.png"
                                             alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/hongmi.png"
                                             alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="header-nav-menu">
                    <div class="container">
                        <ul class="children-list clearfix">
                            <li class="first">
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/TV65.jpg" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/TV65.jpg" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/TV65.jpg" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/TV65.jpg" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/TV65.jpg" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/TV65.jpg" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="header-nav-menu">
                    <div class="container">
                        <ul class="children-list clearfix">
                            <li class="first">
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/bijiben.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/bijiben.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/bijiben.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/bijiben.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/bijiben.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/bijiben.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="header-nav-menu">
                    <div class="container">
                        <ul class="children-list clearfix">
                            <li class="first">
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/pingban.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/pingban.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/pingban.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/pingban.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/pingban.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/pingban.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="header-nav-menu">
                    <div class="container">
                        <ul class="children-list clearfix">
                            <li class="first">
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/jiadian.jpg" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/jiadian.jpg" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/jiadian.jpg" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/jiadian.jpg" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/jiadian.jpg" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/jiadian.jpg" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="header-nav-menu">
                    <div class="container">
                        <ul class="children-list clearfix">
                            <li class="first">
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/luyouqi.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/luyouqi.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/luyouqi.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/luyouqi.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/luyouqi.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/luyouqi.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="header-nav-menu">
                    <div class="container">
                        <ul class="children-list clearfix">
                            <li class="first">
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/zhineng.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/zhineng.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/zhineng.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/zhineng.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/zhineng.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <div class="figure figure-thumb">
                                        <img src="./img/zhineng.png" alt="Xiaomi MIX 4" width="160" height="110">
                                    </div>
                                    <div class="title">Xiaomi MIX4</div>
                                    <p class="price">4999元起</p>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <!----------------------------------------轮播图及主打产品--------------------------------------------------------->
        <div class="home-hero-container">
            <div class="home-hero">
                <!--轮播图-->
                <div id="home-hero-swiper">
                    <!--四个轮播图div-->
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            <a href="">
                                <img src="./img/1.jpg" alt="">
                            </a>
                        </div>
                    </div>
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            <a href="">
                                <img src="./img/2.jpg" alt="">
                            </a>
                        </div>
                    </div>
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            <a href="">
                                <img src="./img/3.png" alt="">
                            </a>
                        </div>
                    </div>
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            <a href="">
                                <img src="./img/4.jpg" alt="">
                            </a>
                        </div>
                    </div>
                    <!--小点-->
                    <div class="swiper-pagination">
                        <a class="swiper-pagination-bullet swiper-pagination-bullet-active"></a>
                        <a class="swiper-pagination-bullet"></a>
                        <a class="swiper-pagination-bullet"></a>
                        <a class="swiper-pagination-bullet"></a>
                    </div>
                    <!--上一张-->
                    <div class="swiper-button-prev"></div>
                    <!--下一张-->
                    <div class="swiper-button-next"></div>
                </div>
                <!--主打商品-->
                <div class="home-hero-sub">
                    <div class="sub_list">
                        <ul class="home-channel-list clearfix">
                            <li>
                                <a href="">
                                    <img src="./img/fuwu.png" alt="">
                                    保障服务
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <img src="./img/tuangou.png" alt="">
                                    企业团购
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <img src="./img/Fma.png" alt="">
                                    F码通道
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <img src="./img/fuwu.png" alt="">
                                    米粉卡
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <img src="./img/huanxin.png" alt="">
                                    以旧换新
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <img src="./img/chongzhi.png" alt="">
                                    话费充值
                                </a>
                            </li>
                        </ul>
                    </div>
                    <div class="goods_img">
                        <ul class="home-promo-list clearfix">
                            <li>
                                <a href="">
                                    <img src="./img/utra.jpg" alt="">
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <img src="./img/mi11.jpg" alt="">
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <img src="./img/erjipro.png" alt="">
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <!-------------------------------------------主商品区------------------------------------------------------------>
        <div class="page-main">
            <div class="container">
                <!--banner图-->
                <div class="home-banner-box">
                    <a href="">
                        <img src="./img/k40.webp" alt="">
                    </a>
                </div>
                <!--商品区-->
                <div class="home-brick-box">
                    <div class="itemBox">
                        <div class="title">
                            <h2>手机</h2>
                        </div>
                        <div class="more">
                            <a href="">
                                查看更多
                                <i class="iconfont icon-youjiantou"></i>
                            </a>
                        </div>
                        <div class="goodsItem">
                            <div class="row clearfix">
                                <div class="goods_l">
                                    <ul>
                                        <li>
                                            <a href="">
                                                <img src="./img/fold.webp" alt="">
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                                <div class="goods_r">
                                    <ul class="brick-list clearfix">
                                        <li>
                                            <a href="">
                                                <img src="./img/mix4webp.webp" alt="">
                                                <h3 class="title">Xiaomi MIX 4</h3>
                                                <p class="desc">CPU全面屏</p>
                                                <p class="price">4999元起</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/mix4webp.webp" alt="">
                                                <h3 class="title">Xiaomi MIX 4</h3>
                                                <p class="desc">CPU全面屏</p>
                                                <p class="price">4999元起</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/mix4webp.webp" alt="">
                                                <h3 class="title">Xiaomi MIX 4</h3>
                                                <p class="desc">CPU全面屏</p>
                                                <p class="price">4999元起</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/mix4webp.webp" alt="">
                                                <h3 class="title">Xiaomi MIX 4</h3>
                                                <p class="desc">CPU全面屏</p>
                                                <p class="price">4999元起</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/mix4webp.webp" alt="">
                                                <h3 class="title">Xiaomi MIX 4</h3>
                                                <p class="desc">CPU全面屏</p>
                                                <p class="price">4999元起</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/mix4webp.webp" alt="">
                                                <h3 class="title">Xiaomi MIX 4</h3>
                                                <p class="desc">CPU全面屏</p>
                                                <p class="price">4999元起</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/mix4webp.webp" alt="">
                                                <h3 class="title">Xiaomi MIX 4</h3>
                                                <p class="desc">CPU全面屏</p>
                                                <p class="price">4999元起</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/mix4webp.webp" alt="">
                                                <h3 class="title">Xiaomi MIX 4</h3>
                                                <p class="desc">CPU全面屏</p>
                                                <p class="price">4999元起</p>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="home-brick-box">
                    <div class="itemBox">
                        <div class="title">
                            <h2>家电</h2>
                        </div>
                        <div class="more">
                            <ul class="tab-list">
                                <li class="tab-active">热门</li>
                                <li class="">电视影音</li>
                            </ul>
                        </div>
                        <div class="goodsItem">
                            <div class="row clearfix">
                                <div class="goods_l">
                                    <ul>
                                        <li>
                                            <a href="">
                                                <img src="./img/TV6.jpg" alt="">
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/tv77.jpg" alt="">
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                                <div class="goods_r">
                                    <ul class="brick-list clearfix">
                                        <li>
                                            <a href="">
                                                <img src="./img/TV65.jpg" alt="">
                                                <h3 class="title">小米电视6 65″OLED</h3>
                                                <p class="desc">小米电视6 65″OLED</p>
                                                <p class="price">6999元</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/TV65.jpg" alt="">
                                                <h3 class="title">小米电视6 65″OLED</h3>
                                                <p class="desc">小米电视6 65″OLED</p>
                                                <p class="price">6999元</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/TV65.jpg" alt="">
                                                <h3 class="title">小米电视6 65″OLED</h3>
                                                <p class="desc">小米电视6 65″OLED</p>
                                                <p class="price">6999元</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/TV65.jpg" alt="">
                                                <h3 class="title">小米电视6 65″OLED</h3>
                                                <p class="desc">小米电视6 65″OLED</p>
                                                <p class="price">6999元</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/TV65.jpg" alt="">
                                                <h3 class="title">小米电视6 65″OLED</h3>
                                                <p class="desc">小米电视6 65″OLED</p>
                                                <p class="price">6999元</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/TV65.jpg" alt="">
                                                <h3 class="title">小米电视6 65″OLED</h3>
                                                <p class="desc">小米电视6 65″OLED</p>
                                                <p class="price">6999元</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/TV65.jpg" alt="">
                                                <h3 class="title">小米电视6 65″OLED</h3>
                                                <p class="desc">小米电视6 65″OLED</p>
                                                <p class="price">6999元</p>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="">
                                                <img src="./img/TV65.jpg" alt="">
                                                <h3 class="title">小米电视6 65″OLED</h3>
                                                <p class="desc">小米电视6 65″OLED</p>
                                                <p class="price">6999元</p>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!--banner图-->
                <div class="home-banner-box">
                    <a href="">
                        <img src="./img/junengxie.jpg" alt="">
                    </a>
                </div>
                <!--视频区-->
                <div class="home-video-box">
                    <div class="itemBox">
                        <h2 class="title">视频</h2>
                        <div class="more">
                            <a href="">
                                查看全部
                                <i class="iconfont icon-youjiantou"></i>
                            </a>
                        </div>
                    </div>
                    <div class="videoContent">
                        <ul class="videoUl clearfix">
                            <li>
                                <a href="">
                                    <img src="./img/video.webp" alt="">
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <img src="./img/video.webp" alt="">
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <img src="./img/video.webp" alt="">
                                </a>
                            </li>
                            <li>
                                <a href="">
                                    <img src="./img/video.webp" alt="">
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <!----------------------------------------底部及网站信息区-------------------------------------------------------->
        <div>
            <div class="site-footer">
                <div class="container">
                    <div class="footer-service">
                        <ul class="list-service clearfix">
                            <li>
                                <a target="_blank"><em class="iconfont icon-gongju"></em>预约维修服务</a>
                            </li>
                            <li>
                                <a target="_blank"><em class="iconfont icon-gongju"></em>预约维修服务</a>
                            </li>
                            <li>
                                <a target="_blank"><em class="iconfont icon-gongju"></em>预约维修服务</a>
                            </li>
                            <li>
                                <a target="_blank"><em class="iconfont icon-gongju"></em>预约维修服务</a>
                            </li>
                            <li>
                                <a target="_blank"><em class="iconfont icon-gongju"></em>预约维修服务</a>
                            </li>
                        </ul>
                    </div>
                    <div class="footer-links clearfix">
                        <dl class="col-links col-links-first">
                            <dt>帮助中心</dt>
                            <dd><a rel="nofollow" href="" target="_blank">账户管理</a></dd>
                            <dd><a href="" target="_blank">购物指南</a></dd>
                            <dd><a rel="nofollow" href="" target="_blank">订单操作</a></dd>
                        </dl>
                        <dl class="col-links col-links-first">
                            <dt>服务支持</dt>
                            <dd><a rel="nofollow" href="" target="_blank">售后政策</a></dd>
                            <dd><a href="" target="_blank">自助服务</a></dd>
                            <dd><a rel="nofollow" href="" target="_blank">相关下载</a></dd>
                        </dl>
                        <dl class="col-links col-links-first">
                            <dt>线下门店</dt>
                            <dd><a rel="nofollow" href="" target="_blank">小米之家</a></dd>
                            <dd><a href="" target="_blank">服务网点</a></dd>
                            <dd><a rel="nofollow" href="" target="_blank">授权体验店</a></dd>
                        </dl>
                        <dl class="col-links col-links-first">
                            <dt>关于小米</dt>
                            <dd><a rel="nofollow" href="" target="_blank">了解小米</a></dd>
                            <dd><a href="" target="_blank">加入小米</a></dd>
                            <dd><a rel="nofollow" href="" target="_blank">投资者关系</a></dd>
                            <dd><a rel="nofollow" href="" target="_blank">企业社会责任</a></dd>
                            <dd><a rel="nofollow" href="" target="_blank">廉洁举报</a></dd>
                        </dl>
                        <dl class="col-links col-links-first">
                            <dt>关注我们</dt>
                            <dd><a rel="nofollow" href="" target="_blank">新浪微博</a></dd>
                            <dd><a href="" target="_blank">官方微信</a></dd>
                            <dd><a rel="nofollow" href="" target="_blank">联系我们</a></dd>
                            <dd><a rel="nofollow" href="" target="_blank">公益基金会</a></dd>
                        </dl>
                        <dl class="col-links col-links-first">
                            <dt>特色服务</dt>
                            <dd><a rel="nofollow" href="" target="_blank">F码通道</a></dd>
                            <dd><a href="" target="_blank">礼物码</a></dd>
                            <dd><a rel="nofollow" href="" target="_blank">防伪查询</a></dd>
                        </dl>
                        <div class="col-contact">
                            <p class="phone">400-100-5678</p>
                            <p>8:00-18:00（仅收市话费）</p>
                            <a rel="nofollow" class="btn btn-line-primary btn-small J_contactBtn">
                                <em class="iconfont-message2"></em>
                                人工客服
                            </a>
                            <div class="follow">
                                关注小米：
                                <a href="https://weibo.com/xiaomishangcheng" target="_blank" class="wb"></a>
                                <a href="#" id="J_followWx" class="wx"></a>
                                <img src="./img/wx-img.png" id="J_followWxImg" style="display: none">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!----------------------------------------网站信息-------------------------------------------------------->
            <div class="site-info">
                <div class="container">
                    <div class="logo ir">
                        小米官网
                    </div>
                    <div class="info-text">
                        <p class="sites">
                            <a rel="nofollow" href="" target="_blank">小米商城</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" target="_blank">MIUI</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" target="_blank">米家</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" target="_blank">米聊</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="//www.duokan.com/" target="_blank">多看</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" target="_blank">游戏</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" target="_blank">政企服务</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" target="_blank">小米天猫店</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" target="_blank">小米集团隐私政策</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" target="_blank">小米公司儿童信息保护规则</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" target="_blank">小米商城隐私政策</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" target="_blank">小米商城用户协议</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" target="_blank">问题反馈</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" class="J_siteGlobalRegion">Select Location</a>
                        </p>
                        <p class="sites">
                            <a rel="nofollow" href="" target="_blank">北京互联网法院法律服务工作站</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" target="_blank">中国消费者协会</a>
                            <span class="sep">|</span>
                            <a rel="nofollow" href="" target="_blank">北京市消费者协会</a>
                        </p>
                        <p>
                            ©
                            <a href="javascript:;" target="_blank" title="mi.com">mi.com</a> 京ICP证110507号
                            <a href="http://beian.miit.gov.cn/" target="_blank" rel="nofollow">京ICP备10046444号</a> <a
                                rel="nofollow"
                                href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802020134"
                                target="_blank">京公网安备11010802020134号</a> <a href="//www.mi.com/culture-license/"
                                target="_blank">京网文[2020]0276-042号</a> <br> <a href="//www.mi.com/medical/record/"
                                target="_blank">（京）网械平台备字（2018）第00005号
                            </a>
                            <a href="//www.mi.com/medical/qualification/"
                                target="_blank">互联网药品信息服务资格证 (京)-非经营性-2014-0090</a> <a
                                href="//www.mi.com/business-license/" target="_blank">营业执照</a> <a
                                href="//www.mi.com/medical/list/" target="_blank">医疗器械质量公告</a> <br> <a
                                href="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/e0c7d4cf3b7cd88de10196e30c92e020.png"
                                target="_blank">增值电信业务许可证</a>&nbsp;网络食品经营备案 京食药网食备202010048 &nbsp;
                            <a href="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/c6859168166651511897f54fa1047fe3.png"
                                target="_blank">食品经营许可证</a><br>
                                违法和不良信息举报电话：171-5104-4404&nbsp;
                            <a href="https://www.mi.com/intellectual" target="_blank">知识产权侵权投诉</a>
                            &nbsp;本网站所列数据，除特殊说明，所有数据均出自我司实验室测试
                        </p>
                    </div>
                    <div class="info-links">
                        <a rel="nofollow" href="" target="_blank">
                            <img rel="nofollow" src="./img/truste.png" alt="TRUSTe">
                        </a>
                        <a rel="nofollow"
                            href="" target="_blank">
                            <img rel="nofollow" src="./img/v-logo-2.png" alt="诚信网站">
                        </a>
                        <a id="_xinchacharenzheng_cert_vip_kexinweb" rel="nofollow" href="" target="_blank">
                            <img
                                rel="nofollow" src="./img/kexin.png" alt="可信网站">
                        </a>
                        <a rel="nofollow" href="" target="_blank">
                            <img src="./img/chengxin.png">
                        </a>
                        <a rel="nofollow" href="" class="safe-auth J_safeAuth">
                            <img rel="nofollow" src="./img/anquan.png" class="img1">
                            <img rel="nofollow" src="./img/390.png" class="img2">
                        </a>
                    </div>
                </div>
                <div class="slogan ir">探索黑科技，小米为发烧而生</div>
            </div>
        </div>
    </div>
    <!------------------------------------------------工具栏---------------------------------------------------------->
    <div class="home-tool-bar">
        <a href="" class="item">
            <div class="icon">
                <img src="./img/phone2.png" alt="">
                <img src="./img/phone.png" alt="">
            </div>
            <span class="text">手机App</span>
        </a>
        <a href="" class="item">
            <div class="icon">
                <img src="./img/user2.png" alt="">
                <img src="./img/user.png" alt="">
            </div>
            <span class="text">个人中心</span>
        </a>
        <a href="" class="item">
            <div class="icon">
                <img src="./img/weixiu2.png" alt="">
                <img src="./img/weixiu.png" alt="">
            </div>
            <span class="text">售后服务</span>
        </a>
        <a href="" class="item">
            <div class="icon">
                <img src="./img/music2.png" alt="">
                <img src="./img/music.png" alt="">
            </div>
            <span class="text">人工客服</span>
        </a>
        <a href="" class="item">
            <div class="icon">
                <img src="./img/gouwuche2.png" alt="">
                <img src="./img/gouwuche.png" alt="">
            </div>
            <span class="text">购物车</span>
        </a>
        <a  href="#J_topbarBannerWrapper" class="item backtop">
            <div class="icon">
                <img src="./img/totop.png" class="static">
                <img src="./img/totop_hover.png" class="hover">
            </div>
            <span data-v-212c8a9d="" class="text">回顶部</span>
        </a>
    </div>
</body>
</html>